<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script src="js/jquery-3.3.1.min.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
		$(function(){
			
		$(".show").click(function(){
			$("div").show()
		})
		$(".hide").click(function(){
			$("div").hide()
		})
		$(".toggle").click(function(){
			$("div").toggle()
		})
				
				
				$(".slideDown").mouseover(function(){
					$("div").slideDown()
				})
				$(".slideUp").mouseover(function(){
					$("div").slideUp()
				})
				$(".slideToggle").mouseover(function(){
					$("div").slideToggle()
				})
						
						
						$(".animate").click(function(){
							$("div").animate({
								height:"+=50px",
								width:"+=50px",
								},1000)
						})
		})
		</script>
	</head>
	<body>
		<button class="show">show</button>
		<button class="hide">hide</button>
		<button class="toggle">toggle</button>
		<br>
		<button class="slideDown">slideDown</button>
		<button class="slideUp">slideUp</button>
		<button class="slideToggle">slideToggle</button>
		<br>
		<button class="animate">自定义</button>
		<div style="width: 100px; height: 100px;background-color: aqua;" id="">
			
		</div>
	</body>

</html>
